<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta charset="UTF-8">
		<title>溯源系统</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
		<link rel="stylesheet" th:href="@{/css/result.css}" href="css/result.css" />
		<link rel="stylesheet" th:href="@{/css/swiper.min.css}" href="lib/css/swiper.css" />
		<link rel="stylesheet" th:href="@{/css/buttons.css}" href="/css/buttons.css" />

		<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4 "></script>
	</head>
	<style>
		.spanSize{
			font-size: 15px;
		}
	</style>
	<body>
		<div class="syall">
			<div class="syhead">
				<p class="fff">尊敬的客户您好，欢迎进入博林鑫溯源系统！</p>
			</div>

			<div class="leftbox">
				<div class="text-ti mmactive">产品信息</span>
				</div>
				<div class="text-ti ">溯源信息</span>
				</div>
				<div class="text-ti">企业信息</span>
				</div>
				<div class="text-ti">溯源监控</span>
				</div>
			</div>

			<div class="show-content">
				<div class="show_txt">
					<div class="cp_text">
						<div class="syresult">
                             <!--th:unless="${result.scanRecord} eq '' or ${result.scanRecord} eq null"
                             th:object="${result.scanRecord}"-->
							<p class="f22 green">查询结果</p>
							<p class="f14 green">Query results</p>
							<p class="text-text">查询编码：<span th:text="${result.scanRecord?.code}">2356235623</span></p>
							<p class="text-text">查询次数：<span th:text="${result.scanRecord?.scanNumber}">2次</span></p>
							<p class="text-text">首次查询时间：<span th:unless="${result.scanRecord==null}" th:text="${#dates.format(result.scanRecord?.createdDate,'yyyy-MM-dd HH:mm:ss')}">2020/6/10</span></p>
							<p class="text-text">结果显示：<span>您所购买的产品是由黑龙江省博林鑫农业集团提供的优质产品。正品保真，请放心购买！</span></p>

						</div>

						<div class="syresult">
							<p class="f22 green">产品信息</p>
							<p class="f14 green">Product information</p>
							<img th:src="@{/img/bo-lin/logoc.png}" src="img/logoc.png" class="green">
							<ul class="xinxi">
								<!--<li>品种名称：<span class="green">珍珠米</span></li>-->
								<li>产品名称：<span class="green" th:text="${result.product.productName}">胚芽鲜米</span></li>
								<!--<li>上市时间：<span class="green">2020-05-18</span></li>-->
								<!--<li>产品商标名：<span class="green">九河原</span></li>-->
								<!--<li>产  地：<span class="green">黑龙江省庆安县</span></li>-->
								<!--<li>净 含 量：<span class="green">5kg/袋</span></li>-->
								<!--<li>保 质 期：<span class="green">3个月</span></li>-->
								<!--<li>储存方式：<span class="green">阴凉通风干燥环境</span></li>-->
								<li th:each="item : ${result.product.productFieldVOS}">
									<span class="spanSize" th:text="${item.attrFieldName+'：'}"></span>
									<span class="green" th:text="${item.values}">阴凉通风干燥环境</span>
								</li>
							</ul>
							<img th:src="${result.product.productImg}" src="img/cp.jpg" class="imgw">
						</div>
					</div>
				</div>

				<div class="show_txt" hidden="hidden">
					<!--<div class="area">
						<dl>
							<div class="hot-area">
								<dt class="text-c f-18 fc-sub1 settledspan">田间管理</dt>
								<div class="arrow-line"></div>
							</div>
							<dd class="hd">
								<ul class="xinxi">
									<li>种子名称：<span class="green">优质培育水稻</span></li>
									<li>化  肥：<span class="green">水稻专用有机肥</span></li>
									<li>整体流程：<span class="green">催芽&#45;&#45;&#45;&#45;翻基肥、翻地&#45;&#45;&#45;&#45;水土检查、育种&#45;&#45;&#45;&#45;施肥、用量&#45;&#45;&#45;&#45;打药时间、用量、农残报告、抽检报告&#45;&#45;&#45;&#45;温湿度等监控</span></li>
									
								</ul>
							
								<div class="img3">
									<ul>
										<li>
											<img th:src="@{/img/bo-lin/nt/1.jpg}" src="img/nt/1.jpg" class="mb-10">
											<p>大棚育苗</p>
										</li>
										<li>
											<img th:src="@{/img/bo-lin/nt/2.jpg}"  src="img/nt/2.jpg" class="mb-10">
											<p>育苗成型</p>
										</li>
										<li>
											<img th:src="@{/img/bo-lin/nt/4.jpg}"  src="img/nt/4.jpg" class="mb-10">
											<p>春翻地</p>
										</li>
										&lt;!&ndash;<li>
											<img src="img/nt/3.jpg" class="mb-10">
											<p>插秧播种</p>
										</li>
										<li>
											<img src="img/nt/5.jpg" class="mb-10">
											<p>人工除草</p>
										</li>
										<li>
											<img src="img/nt/7.jpg" class="mb-10">
											<p>监控检测</p>
										</li>
										<li>
											<img src="img/nt/9.jpg" class="mb-10">
											<p>庆安大米</p>
										</li>
										<li>
											<img src="img/nt/6.jpg" class="mb-10">
											<p>丰收</p>
										</li>&ndash;&gt;
									</ul>
                                 </div>
							</dd>
						</dl>

						</div>-->
					<div class="area"
							 th:if="${result.produceCenter != null}"
							 th:each="item,index : ${result.produceCenter}">
						<dl>
							<div class="hot-area">
								<dt class="text-c f-18 fc-sub1 settledspan"
									th:text="${item.tyMenu.menuName}">田间管理</dt>
								<div class="arrow-line"></div>
							</div>
							<dd class="hd">
								<ul class="xinxi" th:if="${item.tyMenu.isParent==0}">
									<li th:if="${(!#lists.isEmpty(item.tyMenuDataList))&&data.type==0}"
										th:each="data : ${item.tyMenuDataList}">
										<span class="spanSize" th:text="${data.dataKey}+':'"></span>
										<span th:text="${data.dataValue}" class="green">优质培育水稻</span></li>
									<!--<li>化  肥：<span class="green">水稻专用有机肥</span></li>
									<li>整体流程：<span class="green">催芽----翻基肥、翻地----水土检查、育种----施肥、用量----打药时间、用量、农残报告、抽检报告----温湿度等监控</span></li>-->
								</ul>

								<div class="img3" th:if="${item.tyMenu.isParent==0}">
									<ul>
										<li th:if="${(!#lists.isEmpty(item.tyMenuDataList))&& menuData.type==1}"
											th:each="menuData,index : ${item.tyMenuDataList}">
											<img th:each="pic : ${menuData.pics}"
												 th:alt="${menuData?.dataKey}"
												 th:src="${pic}" src="img/nt/1.jpg"
												 class="mb-10">
											<p th:text="${menuData.dataKey}">大棚育苗</p>
										</li>
									</ul>
								</div>
								<div th:if="${item.tyMenu.menuName}=='基地流程'" id="content" class="map">
									<div class="main telus">
										<div style="width: 100%;height:200px;background-color: #9e9e9e" id="map">

										</div>
									</div>
								</div>

								<!--子环节-->
								<dl  th:if="${!#lists.isEmpty(item.sonVoList)}"
									 th:each="menuSonVo,in : ${item.sonVoList}">
									<div class="hot-area">
										<dt style="font-size: 16px"
											th:text="${menuSonVo.menuSonVal}">子环节</dt>
										<div class="arrow-line"></div>
									</div>
									<dd class="hd">
										<ul class="xinxi"
											th:if="${!#lists.isEmpty(menuSonVo.tyMenuSonList)}"
											th:each="sonVos,i: ${menuSonVo.tyMenuSonList}">
											<span th:if="${menuSonVo.isRep == 1}" style="font-size: 16px" th:text="'第'+${i.count}+'次'+${sonVos.tyMenu.menuName}"></span>
											<li th:each="data : ${sonVos.tyMenuDataList}"
												th:if="${data.type==0}">
												<span class="spanSize" th:text="${data.dataKey}+':'"></span>
												<span class="green" th:if="${data.type==0}" th:text="${data.dataValue}">优质培育水稻</span>
												<!--<img th:if="${data.type==1}"
													 th:each="pic : ${data.pics}"
													 th:alt="${data?.dataKey}"
													 th:src="${pic}"
													  src="img/cj.jpg" class="imgw">-->
											</li>
											<div class="img3">
												<ul>
													<li th:if="${data.type==1}" th:each="data : ${sonVos.tyMenuDataList}">
														<img th:if="${data.type==1}"
															 th:each="pic : ${data.pics}"
															 th:alt="${data?.dataKey}"
															 th:src="${pic}"
															 src="img/cj.jpg" class="imgw">
														<p th:text="${data.dataKey}">大棚育苗</p>
													</li>
												</ul>
											</div>
										</ul>
									</dd>
								</dl>
							</dd>

						</dl>
					</div>

						<!--<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">种植记录</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<ul class="xinxi">
										<li>基地名称：<span class="green">庆安县春芽水稻种植专业合作社</span></li>
										<li>基地地址：<span class="green">庆安县发展乡发源村电站屯</span></li>
										<li>负责人：<span class="green">曲士龙</span></li>
										<li>施肥作业：<span class="green">飞机喷雾视频</span></li>
									</ul>
									

									<div class="w50">
										<ul>
											<li>
												<img th:src="@{/img/bo-lin/jd02.jpg}" src="img/jd02.jpg" class="mb-10">
												<p>互联网+农业示范基地</p>
											</li>
											<li>
												<img th:src="@{/img/bo-lin/jd03.jpg}" src="img/jd03.jpg" class="mb-10">
												<p>基地</p>
											</li>
										</ul>
									</div>

									<div id="content" class="map">
										<div class="main telus">
											<div style="width: 100%;height:200px;background-color: #9e9e9e" id="map">

											</div>
										</div>
									</div>

								</dd>
							</dl>
						</div>-->

						<!--特色种养结合记录-->
						<!--<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">特色种养结合记录</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="img3">

										<ul>
											<li>
												<img src="img/xx/3.jpg" class="mb-10">
												<p>稻田鱼群</p>

											</li>
											<li>
												<img src="img/xx/4.jpg" class="mb-10">
												<p>稻田鱼</p>

											</li>
											<li>
												<img src="img/xx/5.jpg" class="mb-10">
												<p>稻田蟹</p>

											</li>
											<li>
												<img src="img/xx/1.jpg" class="mb-10">
												<p>避暑游玩</p>

											</li>
											<li>
												<img src="img/xx/2.jpg" class="mb-10">
												<p>田园风光</p>

											</li>

										</ul>
									</div>
								</dd>
							</dl>
						</div>-->

						<!--检测信息-->
						<div class="area" th:if="${result.reportApiVO!=null}">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">检测信息</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="w50 img3">
										<ul>
											<li th:if="${!#lists.isEmpty(result.reportApiVO?.ReportImgDOList)}"
												th:each="reportList : ${result.reportApiVO?.ReportImgDOList}">
												<a href="#"><img th:src="${reportList.imgSrc}" src="img/report/1.jpg" class="mb-10"></a>
											</li>
											<!--<li>
												<a href="#"><img src="img/report/2.jpg" class="mb-10"></a>
											</li>
											<li>
												<a href="#"><img src="img/report/3.jpg" class="mb-10"></a>
											</li>
											<li>
												<a href="#"><img src="img/report/4.jpg" class="mb-10"></a>
											</li>-->
										</ul>
									</div>

								</dd>
							</dl>
						</div>
						
						
									<!--<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan"> 0.5kg真空包装</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									&lt;!&ndash; Swiper &ndash;&gt;
									<div class="swiper-container">
										<div class="swiper-wrapper">
											<div class="swiper-slide">
												<div class="jg_text">
													<ul>
														<li>生产批号：20200504</li>
														<li>生产商：黑龙江博林鑫农业集团有限责任公司</li>
														<li>发运方：待定</li>
														<li>水份：待定</li>
														<li>碎米：待定</li>
														<li>互混：待定</li>
														<li>胚芽：待定</li>
														<li>腹白：待定</li>
													</ul>
												</div>
											</div>
											<div class="swiper-slide">
												<div class="jg_text">
													<ul>
														<li>生产批号：20200504</li>
														<li>生产商：黑龙江博林鑫农业集团有限责任公司</li>
														<li>发运方：待定</li>
														<li>水份：待定</li>
														<li>碎米：待定</li>
														<li>互混：待定</li>
														<li>胚芽：待定</li>
														<li>腹白：待定</li>
													</ul>
												</div>
											</div>
										</div>
										&lt;!&ndash; Add Pagination &ndash;&gt;
										<div class="swiper-pagination"></div>
										&lt;!&ndash; Add Arrows &ndash;&gt;
										<div class="swiper-button-next"></div>
										<div class="swiper-button-prev"></div>
									</div>
								</dd>
							</dl>
						</div>-->

					</div>

					<div class="show_txt" hidden="hidden">
						<!--公司简介-->
						<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">公司简介</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="w50">
										<ul>
											<li>
												<img th:src="@{/img/company.jpg}" src="img/gs.jpg" class="mb-10">

											</li>
											<li>
												<img th:src="@{/img/bo-lin/gs.jpg}" src="img/gs.jpg" class="mb-10">

											</li>

										</ul>
									</div>
									<p class="company">集团成立于2009年，是一家农业全产业链融合发展的民营集团、占地面积12万平方米、建筑面积6万平方米。集粮食种植、仓储、加工、销售、农业观光、新能源开发、现代物流、现代服务业为一体的新型民营集团。</p>
									<p class="company">集团旗下六家子公司：庆安味之道餐饮管理公司、博林清洁能源开发有限公司、博林生态山庄有限公司、林海工贸有限公司、博林饲料制造有限公司、苏州初稻农业科技有限公司。集团有先进的全自动化大米生产线3条，装机1000千瓦水力发电站一座，企业年可加工水稻30万吨，仓储能力10万吨，发电1000万度。基地利用先进的物联网系统可对现场气象、土壤、水源环境实时监测，建立可追溯体系，利用太阳能频振式杀虫灯，减少或者避免农药使用，实现从田园到餐桌全程可监控，让消费者吃到放心米。在传统田间作业基础上新增特色种养结合，稻田养鸭、稻田养鱼、稻田养蟹等生态农业项目。</p>
									<p class="company">结合基地地理位置优势和自然环境，开展特色种养殖，建有巨型田间稻画，观光塔2座，观光栈道、荷花池1处，此外计划新建高标准采摘园区，将整个基地打造成为集水稻种植技术推广、农业观光旅游服务、特色农产品销售为一体的现代化农业样板区，引领更多农户在传统农作基础上，提高素质，创新模式，实现富裕。</p>
								</dd>
							</dl>
						</div>

						<!--荣誉资质-->
						<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">荣誉资质</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="img3">
										<ul>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/04.jpg}" name="04" src="img/04.jpg"></a>
											</li>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/05.jpg}" src="img/05.jpg"></a>
											</li>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/06.jpg}" src="img/06.jpg"></a>
											</li>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/07.jpg}" src="img/07.jpg"></a>
											</li>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/08.jpg}" src="img/08.jpg"></a>
											</li>
										</ul>

									</div>
								</dd>
							</dl>
						</div>
						<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">营业执照</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="img3">
										<ul>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/10.jpg}" src="img/10.jpg"></a>
											</li>
										</ul>

									</div>
								</dd>
							</dl>
						</div>
						<div class="area">
							<dl>
								<div class="hot-area">
									<dt class="text-c f-18 fc-sub1 settledspan">产品商标</dt>
									<div class="arrow-line"></div>
								</div>
								<dd class="hd">
									<div class="img3">
										<ul>
											<li>
												<a href="#"><img th:src="@{/img/bo-lin/09.jpg}" src="img/09.jpg"></a>
											</li>
										</ul>

									</div>
								</dd>
							</dl>
						</div>

					</div>

					<div class="show_txt" hidden="hidden">
						扫码查看....
					</div>
				</div>

			</div>

             <p class="bottom">技术支持：广州天码防伪科技</p>
			<script type="text/javascript" th:src="@{/js/jquery-2.1.4.js}" src="js/jquery-2.1.4.js"></script>
			<script type="text/javascript" th:src="@{/js/swiper.min.js}" src="lib/js/swiper.min.js"></script>
		    <script src="/js/plugins/layer/layer.js" th:src="@{/js/plugins/layer/layer.js}"></script>


			<script type="text/javascript" th:inline="javascript">
				var ctx = [[@{/}]];

				var swiper = new Swiper('.swiper-container', {
					pagination: {
						el: '.swiper-pagination',
						type: 'fraction',
					},
					navigation: {
						nextEl: '.swiper-button-next',
						prevEl: '.swiper-button-prev',
					},
					grabCursor : true,
					observer: true,
					observeParents: true,
				});

				/* 隐藏部分*/
				$(".leftbox").on("click", "div", function() {
					var $index = $(this).index();
					$(this).addClass('mmactive').siblings('div').removeClass('mmactive')
					$(".show_txt").eq($index).show().siblings(".show_txt").hide()

				})

				$(".hot-area").click(function() {
					$(this).find(".arrow-line").toggleClass("down");
					$(this).next(".hd").slideToggle();
				});

				/*认证报告点击放大*/
				/*$(".img3 a").each(function() {
					var $newSrc = $(this).attr("href") + "?imgsrc=" + $(this).children("img").attr("src") + "&title=" + escape($(this).children("img").attr("name"))
					$(this).attr("href", ($newSrc))
				})*/
				$(".img3 a").click(function() {
					var url =$(this).children("img").attr("src");
					var name = $(this).children("img").attr("name");
					layer.open({
						type: 1,
						title: false,
						closeBtn: 0,
						shadeClose: true,
						area: ['90%','66%'], //宽高
						content: "<img alt=" + name + " title=" + name + " src=" + url + " />"
					});
				})


				/*地图*/
				var map = new BMap.Map("map");
				var point = new BMap.Point(127.840246, 47.078614); //创建经纬度地址
				var marker = new BMap.Marker(point); // 创建标注
				var myIcon = new BMap.Icon( ctx+"img/bo-lin/add.png", new BMap.Size(28, 28)); //图标
				var marker = new BMap.Marker(point, {
					icon: myIcon
				}); // 创建标注
				map.addOverlay(marker); // 将标注添加到地图中
				map.centerAndZoom(point, 40);
				map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
				var mapType1 = new BMap.MapTypeControl({
					mapTypes: [BMAP_NORMAL_MAP, BMAP_HYBRID_MAP]
				});
				var overView = new BMap.OverviewMapControl();
				var top_left_control = new BMap.ScaleControl({
					anchor: BMAP_ANCHOR_TOP_LEFT
				}); // 左上角，添加比例尺
				map.addControl(new BMap.ScaleControl());
				map.addControl(new BMap.OverviewMapControl());
				map.addControl(top_left_control);
				map.addControl(mapType1); //2D图，卫星图
				map.addControl(overView); //添加默认缩略地图控件
				map.enableScrollWheelZoom(true);
				var opts = {
					width: 180, // 信息窗口宽度
					height: 110, // 信息窗口高度
					title: "黑龙江省博林鑫农业集团 ", // 信息窗口标题
					enableMessage: true //设置允许信息窗发送短息
				}
				var infoWindow = new BMap.InfoWindow("地址：庆安县发展乡发源村电站屯", opts); // 创建信息窗口对象 
				marker.addEventListener("click", function() {
					map.openInfoWindow(infoWindow, point); //开启信息窗口
				});

			</script>

	</body>

</html>